<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<title>jQuery-color-utils --- test</title>
		<script type="text/javascript" src="jquery.js"></script>
		<script type="text/javascript" src="../src/jquery.color.utils.js"></script>
		<script type="text/javascript">
			$(init);
			function init(){
				$('#execute').click(execute);
				$('#div1').click(function(){
					$(this).modColor('backgroundColor','r',10);
				});
				$('#div2').click(function(){
					$(this).modColor('backgroundColor','r',10,true);
				});
				
			}
			function execute(){
				$('#test_result').text('');
				var result;
				//isHexadecimalColor
				debug('Test For $.isHexadecimalColor');
				result = $.isHexadecimalColor('#555');
				assert(true,result);
				result = $.isHexadecimalColor('#fff');
				assert(true,result);
				result = $.isHexadecimalColor('#000');
				assert(true,result);
				result = $.isHexadecimalColor('#ggg');
				assert(false,result);
				result = $.isHexadecimalColor('#0000');
				assert(false,result);
				result = $.isHexadecimalColor('#00000');
				assert(false,result);
				result = $.isHexadecimalColor('#000000');
				assert(true,result);
				result = $.isHexadecimalColor('#0000000');
				assert(false,result);

				//isRGBColor
				debug('Test For $.isRGBColor');
				result = $.isRGBColor('rgb(0,0,0)');
				assert(true,result);
				result = $.isRGBColor('rgb(0, 0, 0)');
				assert(true,result);
				result = $.isRGBColor('rgb(0,  0,  0)');
				assert(false,result);
				result = $.isRGBColor('rgb(255,255,255)');
				assert(true,result);
				result = $.isRGBColor('rgb(256,255,255)');
				assert(false,result);
				result = $.isRGBColor('rgb(99,99,99)');
				assert(true,result);
				result = $.isRGBColor('#000000');
				assert(false,result);
				result = $.isRGBColor('aaaa');
				assert(false,result);

				//isColor
				debug('Test For $.isColor');
				result = $.isColor('#555');
				assert(true,result);
				result = $.isColor('#fff');
				assert(true,result);
				result = $.isColor('#000');
				assert(true,result);
				result = $.isColor('#ggg');
				assert(false,result);
				result = $.isColor('#0000');
				assert(false,result);
				result = $.isColor('#00000');
				assert(false,result);
				result = $.isColor('#000000');
				assert(true,result);
				result = $.isColor('#0000000');
				assert(false,result);
				result = $.isColor('rgb(0,0,0)');
				assert(true,result);
				result = $.isColor('rgb(0, 0, 0)');
				assert(true,result);
				result = $.isColor('rgb(0,  0,  0)');
				assert(false,result);
				result = $.isColor('rgb(255,255,255)');
				assert(true,result);
				result = $.isColor('rgb(256,255,255)');
				assert(false,result);
				result = $.isColor('rgb(99,99,99)');
				assert(true,result);
				result = $.isColor('#000000');
				assert(true,result);
				result = $.isColor('aaaa');
				assert(false,result);
				
				//RGB
				debug('Test For $.RGB');
				result = $.RGB('rgb(0,0,0)');
				assert(0,result[0]);
				assert(0,result[1]);
				assert(0,result[2]);
				result = $.RGB('#fff');
				assert(255,result[0]);
				assert(255,result[1]);
				assert(255,result[2]);
				result = $.RGB([2,3,5]);
				assert('rgb(2, 3, 5)',result);

				//colorVectorValue
				debug('Test For $.colorVectorValue');
				result = $.colorVectorValue('#000000');
				assert(0,result);
				result = $.colorVectorValue('#000001');
				assert(1,result);
				result = $.colorVectorValue('#010101');
				assert(1.73,result);
				result = $.colorVectorValue('#ffffff');
				assert(441.67,result);

				//colorDecimalValue
				debug('Test For $.colorDecimalValue');
				result = $.colorDecimalValue('#000000');
				assert(0,result);
				result = $.colorDecimalValue('#000001');
				assert(1,result);
				result = $.colorDecimalValue('#f00000');
				assert(15728640,result);
				result = $.colorDecimalValue('#ffffff');
				assert(16777215,result);
				
				//fmtColor
				debug('Test For $.fmtColor');
				result = $.fmtColor([]);
				assert('',result);
				result = $.fmtColor('#000');
				assert('rgb(0, 0, 0)',result);
				result = $.fmtColor('#0ff');
				assert('rgb(0, 255, 255)',result);
				result = $.fmtColor('#fff');
				assert('rgb(255, 255, 255)',result);
				result = $.fmtColor('#ffffff');
				assert('rgb(255, 255, 255)',result);
				result = $.fmtColor('#000000');
				assert('rgb(0, 0, 0)',result);
				result = $.fmtColor('#ff0000');
				assert('rgb(255, 0, 0)',result);
				result = $.fmtColor('rgb(0, 0, 0)');
				assert('#000000',result);
				result = $.fmtColor('rgb(255, 0, 0)');
				assert('#ff0000',result);
				result = $.fmtColor('rgb(0, 0, 0)','rgb');
				assert('rgb(0, 0, 0)',result);
				result = $.fmtColor('#666666','hexadecimal');
				assert('#666666',result);
				result = $.fmtColor('#666','hexadecimal');
				assert('#666666',result);
				
				//modColor
				debug('Test For $.modColor');
				result = $.modColor('#000000','r',5);
				assert('rgb(5, 0, 0)',result);
				result = $.modColor('#000000','g',255);
				assert('rgb(0, 255, 0)',result);
				result = $.modColor('#0f0010','b',16);
				assert('rgb(15, 0, 32)',result);
				result = $.modColor('#000000','g',300);
				assert('rgb(0, 255, 0)',result);
				result = $.modColor('#FF0000','r',-15);
				assert('rgb(240, 0, 0)',result);
				result = $.modColor('#FF0000','b',-30);
				assert('rgb(255, 0, 0)',result);
				result = $.modColor('#000000',{'r': 5,'g': 10,'b': 15});
				assert('rgb(5, 10, 15)',result);
				result = $.modColor('rgb(0, 0, 0)','r',5);
				assert('rgb(5, 0, 0)',result);
				result = $.modColor('rgb(0, 0, 0)','g',255);
				assert('rgb(0, 255, 0)',result);
				result = $.modColor('rgb(15, 0, 16)','b',16);
				assert('rgb(15, 0, 32)',result);
				result = $.modColor('rgb(0, 0, 0)','g',300);
				assert('rgb(0, 255, 0)',result);
				result = $.modColor('rgb(255, 0, 0)','r',-15);
				assert('rgb(240, 0, 0)',result);
				result = $.modColor('rgb(255, 0, 0)','b',-30);
				assert('rgb(255, 0, 0)',result);
				result = $.modColor('#000000',{'r': 5,'g': 10,'b': 15});
				assert('rgb(5, 10, 15)',result);
				result = $.modColor('#000000',[5,10,15]);
				assert('rgb(5, 10, 15)',result);
				
				//averageColor
				debug('Test For $.averageColor');
				result = $.averageColor(['#000000']);
				assert('rgb(0, 0, 0)',result);
				result = $.averageColor(['#ff0000','#0000ff']);
				assert('rgb(128, 0, 128)',result);

				//colorize
				debug('Test For $.colorize');
				result = $.colorize('coffie');
				assert('#c0ff1e',result);
				result = $.colorize('kids');
				assert('#000000',result);
				result = $.colorize('loaded');
				assert('#10aded',result);
				result = $.colorize({max:100,min:0,value:50});
				assert('#0ccbd0',result);
				result = $.colorize({max:"100",min:"0",value:"50"});
				assert('#0ccbd0',result);

				
				//fn.averageColor
				debug('Test For $.fn.averageColor');
				result = $('#test_averageColor div').averageColor();
				assert('rgb(136, 136, 136)',result);
				
				//fn.sortByColor
				debug('Test For $.fn.sortByColor');
				result = $('#test_sortByColor div').sortByColor();
				assert('test_sortByColor_000',result.eq(0).attr('id'));
				assert('test_sortByColor_002',result.eq(1).attr('id'));
				assert('test_sortByColor_004',result.eq(2).attr('id'));
				assert('test_sortByColor_003',result.eq(3).attr('id'));
				assert('test_sortByColor_001',result.eq(4).attr('id'));
		
			}
			function debug(message){
					$('#test_result').append($('<p class="debug_message"/>').text(message));			
			}
			function assert(expect,result){
				if(expect == result){
					$('#test_result').append($('<p class="result_ok"/>').text('OK : expect: ' + expect +' result: ' + result));			
				}else{
					$('#test_result').append($('<p class="result_error"/>').text('NG : expect: ' + expect +' but result: ' + result));			
				} 
			}
		</script>
		<style type="text/css">
			html,body{
				font-family:monospace;
			}
			#test_result,#test_result p{
				font-size:10pt;
				margin:0px;
				padding:0px;
			}
			#test_result p.debug_message{
				color:black;
				font-weight:bold;
			}
			#test_result p.result_error{
				color:red;
			}
			#test_result p.result_ok{
				color:green;
			}
			div.test{
				width:50px;
				height:50px;
			}
			div.test_sortByColor{
				position:relative;
				width:10px;
				height:10px;
			}
		</style>
	</head>
	<body>
		<input type="button" id="execute" value="execute">
		<div id="test_result"></div>
		<div id="test_averageColor" style="display:none;">
			<div style="background-color:#808080" class="test" ></div>
			<div style="background-color:#909090" class="test" ></div>
		</div>

		<div id="test_sortByColor" style="display:none;">
			<div class="test_sortByColor" id="test_sortByColor_000" style="background-color:#000000;border:#999999;"></div>
			<div class="test_sortByColor" id="test_sortByColor_001"  style="background-color:#900000;border:#000001;"></div>
			<div class="test_sortByColor" id="test_sortByColor_002"  style="background-color:#000001;border:#010100;"></div>
			<div class="test_sortByColor" id="test_sortByColor_003"  style="background-color:#010000;border:#010000;"></div>
			<div class="test_sortByColor" id="test_sortByColor_004"  style="background-color:#000100;border:#000101;"></div>
		</div>
	</body>
</html>
